<template>
  <div class="enterprise-enrollment">
   <div class='cust-plan'>
    首页 > 业务入口 > 企业培训及合作
    <div class="cust-plan-img" :style="{backgroundImage:'url(' + banner02+ ')'}">
       <div class="cust-input">
         <div class="input-title">选择您的企业<span class="input-text">定制项目培训方案</span></div>
         <el-input
          placeholder="*公司名称"
          v-model="input"
          required="isHaveTo"
          clearable>
        </el-input>
        <el-input
          placeholder="*联系人"
          v-model="input1"
          clearable>
        </el-input>
        <el-input
          placeholder="*联系方式"
          v-model="input2"
          clearable>
        </el-input>
        <el-input
          placeholder="培训预算"
          v-model="input3"
          clearable>
        </el-input>
        <el-input
          placeholder="培训预算"
          v-model="input4"
         
          clearable>
        </el-input> 
        <div class="submit" @click="submit">提交</div>
        </div>
    </div>
   </div>
   <div class="core-bussiness">
     <div class="core-bussiness-title">腾科教育企业<span>核心业务</span></div>
     <div class="core-bussiness-card" v-for="(item,index) in yewudata" :key="index">
       <img :src="item.img" class="core-bussiness-img">
       <div class="title">{{item.text1}}</div>
       <div class="desc">{{item.text2}}</div>
     </div>
   </div>
   <div class="core-bussiness industry-case">
     <div class="core-bussiness-title">行业<span>案例</span></div>
     <div>
      <div class="industry-case-card" v-for="(item,index) in anli" :key="index">
        <img class="caseimg" :src='item.img' />
        <div class="casetext01">{{item.text1}}</div>
        <div class="casetext02">{{item.text2}}</div>
      </div>
     </div>
   </div>
  </div>
</template>
<script>
import banner02 from "../img/banner02.png"
import yewu01 from "../img/yewu01.png"
import yewu02 from "../img/yewu02.png"
import yewu03 from "../img/yewu03.png"
import yewu04 from "../img/yewu04.png"
import anlie01 from "../img/anlie01.png"
import anlie02 from "../img/anlie02.png"
import anlie03 from "../img/anlie03.png"
import anlie04 from "../img/anlie04.png"
export default {
  data(){
    return{
      banner02:banner02,
      input: '',
      input1: '',
      input2: '',
      input3: '',
      input4: '',
      yewudata:[
        {
          img:yewu01,
          text1:"客户定制培训",
          text2:"根据客户需求提供IT行业技术类定制培训",
        },
        {
          img:yewu02,
          text1:"E－Learning",
          text2:"根据客户需求提供E－Learning解决方案",
        },
        {
          img:yewu03,
          text1:"标准认证培训",
          text2:"IT行业标准认证课程培训及考试安排",
        },
        {
          img:yewu04,
          text1:"人才服务",
          text2:"面向企业用户，我们提供猎头服务、人力咨询、定制培养等服务",
        },
      ],
      anli:[
        {
          img:anlie01,
          text1:"国内企业及组织",
          text2:"先后为中通服、中国移动等运营商；中国航发商发、东方有线等国企；上海市教委、公安局等事业单位；上海华讯、宝信等系统集成商提供培训服务。",
        },
        {
          img:anlie02,
          text1:"金融行业",
          text2:"先后为交通银行、兴业银行、工商银行、浦发银行、海通证券等金融行业培训。。",
        },
        {
          img:anlie03,
          text1:"IT厂商",
          text2:"先后为思科（中国）、IBM、上海贝尔等厂商的技术工程师培训，同时负责华为、红帽、vmware等合作厂商的客户交付。",
        },
        {
          img:anlie04,
          text1:"海外客户",
          text2:"先后为埃塞俄比亚、伊朗等海外客户进行培训。"
        },
      ]
    }
  },
   methods:{
    click(){
      this.value=''
      this.input=""
      this.input1=""
      this.input2=""
      this.input3=""
      this.input4=""
      this.input5=""
    } ,
     submit () {
        if (!this.input) {
            showToast('请输入公司名称!')
            return false
        }
        if (!this.input1) {
            showToast('请输入联系人!')
            return false
        }
        if (!this.input2) {
            showToast('请输入联系人方式!')
            return false
        }
        return true
        }
  },
    computed: {
    isHaveTo: function() {
        return this.ruleForm.region !== `1`;
      }
    }
}
</script>
<style lang="stylus">
.enterprise-enrollment
  .cust-plan
    margin -136px auto 0 auto
    padding 40px
    text-align right 
    width: 1200px;
    height: 641px;
    font-family: MicrosoftYaHeiLight;
    font-size: 12px;
    color: #666666;
    // color: #404040;
    background-color: #ffffff; 
    .cust-plan-img
      width: 1120px;
      height: 516px;
      margin-top 20px
      background-size 100% 100%
      background-repeat:no-repeat
      padding-top: 40px;
      padding-left: 667px;
      .cust-input
          width: 403px;
          height: 436px;
          background-color: #242124;
          padding: 40px;
          .input-title
              height 40px
              text-align center
              margin-bottom 21px  
              font-family: MicrosoftYaHei-Bold;
              font-size: 18px;
              font-weight: normal;
              font-stretch: normal;
              line-height: 40px;
              letter-spacing: 0px;
              color: #f4f4f4;
              .input-text
                  font-family: MicrosoftYaHei-Bold;
                  font-size: 18px;
                  font-weight: normal;
                  letter-spacing: 0px;
                  color: #da0800;
          .el-input__inner
              margin-bottom 10px
              background transparent
              border-radius 0
              border: solid 1px #595959
          .el-input__inner:hover
              border: solid 1px #da0800;
          .submit
              width: 323px;
              height: 36px;
              line-height 36px;
              text-align center
              background-color: #da0800;
          .submit:hover
              cursor:pointer
              color #ffffff
  .core-bussiness
    width: 1200px;
    height: 466px;
    margin 20px auto;
    background-color: #ffffff;
    padding 62px 40px 0 40px
    font-size: 28px;
    color: #1b1b1b;
    .core-bussiness-title
      text-align center;
      margin-bottom 50px;
      & > span
        color: #da0800;
    .core-bussiness-card
      float left
      margin-right 20px
      &:last-child
        margin-right 0;
      .core-bussiness-img
        width: 265px;
        height: 172px;
      .title
        font-family: MicrosoftYaHei-Bold;
        font-size: 16px;
        line-height: 40px;
        color: #333333;
      .desc
        width 251px
        font-size: 14px;
        line-height: 24px;
        color: #333333;
  .industry-case
    height 1150px
    .industry-case-card
      float left
      height 511px;
      width: 551px;
      margin-right 10px
      &:nth-child(even)
        margin-right 0
      .caseimg
        width: 551px;
        height: 338px;
      .casetext01
        font-size: 18px;
        line-height: 40px;
        color: #1b1b1b;
      .casetext02
        font-size: 14px;
        line-height: 24px;
        color: #666666;
        padding-right 20px
</style>
